<!DOCTYPE html>
<html lang="en"
      xmlns:th="http://www.thymeleaf.org">
<head th:include="console/header">
</head>
<body>
    <section class="content-header">
        <h1>后台总览</h1>
    </section>
    <section class="content">
        <div class="row">
            <div class="col-md-3 col-sm-6 col-xs-12">
                <div class="info-box">
                    <span class="info-box-icon bg-aqua"><i class="ion ion-ios-gear-outline"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">会员总数</span>
                    <span class="info-box-number">
                        <span th:text="${user}">0</span>
                        <small>个</small>
                    </span>
                    </div>
                </div>
            </div>
            <div class="col-md-3 col-sm-6 col-xs-12">
                <div class="info-box">
                    <span class="info-box-icon bg-aqua"><i class="ion ion-ios-gear-outline"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">管理员总数</span>
                        <span class="info-box-number">
                        <span th:text="${admin}">0</span>
                        <small>个</small>
                    </span>
                    </div>
                </div>
            </div>

            <div class="col-md-3 col-sm-6 col-xs-12">
                <div class="info-box">
                    <span class="info-box-icon bg-red"><i class="fa fa-google-plus"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">角色总数</span>
                    <span class="info-box-number">
                        <span th:text="${role}">0</span>
                        <small>个</small>
                    </span>
                    </div>
                </div>
            </div>

            <div class="col-md-3 col-sm-6 col-xs-12">
                <div class="info-box">
                    <span class="info-box-icon bg-green"><i class="ion ion-ios-cart-outline"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">资源总数</span>
                    <span class="info-box-number">
                        <span th:text="${menu}">0</span>
                        <small>个</small>
                    </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="box box-warning">
                    <div class="box-header">
                        单文件上传组件
                    </div>
                    <div class="box-body">
                        <img id="pic-preview" src="/assets/adminlte-2.3.7/img/photo1.png" style="width: 100px; height: 100px;" />
                        <input type="hidden" name="pic" class="form-control" id="pic" />
                        <button onclick="uploadModel.upload_one_image('图片上传','pic','');" type="button" class="btn btn-default" >上传图片</button>
                    </div>
                </div>
            </div>
            <div class="col-md-6">
                <div class="box box-warning">
                    <div class="box-header">
                        多文件上传组件
                    </div>
                    <div class="box-body">
                        <ul id="mulitBox" class="users-list clearfix"></ul>
                        <button onclick="uploadModel.upload_multi_image('图片上传','mulitBox','item-tpl','');" type="button" class="btn btn-default" >上传图片</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <form class="form-horizontal js-ajax-form" action="/console/ueditor/save" method="post">
                <div class="box box-info">
                    <div class="box-header">
                        编辑器组件（简单演示，更多功能查阅官方API）
                    </div>
                    <div class="box-body">
                        <script id="content" name="content" type="text/plain"></script>
                    </div>
                    <div class="box-footer">
                        <button type="submit" class="btn btn-default js-ajax-submit">提交</button>
                    </div>
                </div>
                </form>
            </div>
        </div>
    </section>
    <div th:replace="console/footer"></div>
    <script type="text/html" id="item-tpl">
        <li id="saved-image{id}">
            <input id="photo-{id}" type="hidden" name="photo_urls[]" value="{filepath}">
            <img id="photo-{id}-preview" src="{url}" style="height:128px;width: 128px;" />
            <input class="form-control" id="photo-{id}-name" type="hidden" name="photo_names[]" value="{name}" style="width: 200px;" title="图片名称" />
            <a href="javascript:(function(){$('#saved-image{id}').remove();})();">移除</a>
        </li>
    </script>
    <script type="text/javascript" th:inline="javascript">
    $(function () {
        UE.getEditor("content");
    });
    </script>
</body>
</html>